<!-- 司机车辆表 -->
<template>
  <div class="app-container">
    <el-table v-loading="loading" :data="driverList" size="mini" stripe fit border :header-cell-style="{'text-align':'center'}">
      <el-table-column label="车牌号" prop="vehicleNumber"/>
      <el-table-column label="车辆类型" prop="vehicleType" :formatter="typeFormat" show-overflow-tooltip/>
      <el-table-column label="车牌颜色" prop="vehiclePlateColorCode" :formatter="plateColorFormat"/>
      <el-table-column label="能源类型" prop="vehicleEnergyType" :formatter="energyTypeFormat"/>
      <el-table-column label="核定载质量(千克)" prop="vehicleTonnage"/>
      <el-table-column label="使用性质" prop="useCharacter"/>
      <el-table-column label="认证状态" prop="isCert" :formatter="isCertFormat"/>
    </el-table>

    <pagination
      v-show="total>0"
      :total="total"
      :page.sync="queryParams.current"
      :limit.sync="queryParams.size"
      @pagination="getDriverCar"
    />
  </div>
</template>

<script>
  import {listVehicle} from "@/api/tws/vehicle";

  export default {
    name:'DriverCar',
    components: {},
    props:{
      driverId: {
        type:String
      }
    },
    data() {
      return{
        loading:true,
        driverList:[],
        plateColorOptions: [],
        energyTypeOptions: [],
        typeOptions: [],
        isCertOptions: [],
        total:0,
        queryParams:{
          current:1,
          size: 10,
          driverId:null,
        }
      }
    },
    watch: {
      driverId: function (newData, oldData) {
        if (newData){
          this.queryParams.driverId = newData;
          this.reset();
        }
      }
    },
    created() {
      this.getDict();
    },
    methods: {
      getDict(){
        this.getDicts("vehicle_plate_color").then(res =>{
          this.plateColorOptions = res.data;
        }),
        this.getDicts("vehicle_energy_type").then(res =>{
          this.energyTypeOptions = res.data;
        }),
        this.getDicts("vehicle_type").then(res =>{
          this.typeOptions = res.data;
        }),
        this.getDicts("is_cert").then(res =>{
          this.isCertOptions = res.data;
        })
      },
      getDriverCar(){
        listVehicle(this.queryParams).then(res=>{
          this.total = res.total;
          this.loading = false;
          this.driverList = res.rows;
        })
      },
      reset(){
        this.driverList = [];
        this.getDriverCar();
      },
      plateColorFormat(row, column){
        return this.selectDictLabel(this.plateColorOptions,row.vehiclePlateColorCode)
      },
      energyTypeFormat(row, column){
        return this.selectDictLabel(this.energyTypeOptions,row.vehicleEnergyType)
      },
      typeFormat(row, column){
        return this.selectDictLabel(this.typeOptions,row.vehicleType)
      },
      isCertFormat(row, column){
        return this.selectDictLabel(this.isCertOptions,row.isCert)
      }
    }
  }
</script>

<style>

</style>
